<template>
    <div id="goods">
        <van-notice-bar text="商品列表商品列表商品列表商品列表商品列表商品列表商品列表商品列表" left-icon="volume-o" />
        <ul>
            <router-link 
            tag="li" 
            v-for="(item) in dLists" 
            :key="item.id"
            :to="'/detail/'+ item.id" >
                <!-- {{ item.id }}:{{ item.goodname }} -->
                <h2 class="sp">这是分割用的</h2>
                <van-card 
                num="3" 
                tag="标签" 
                price="2.00" 
                :desc="'描述信息:商品编号' + item.id" 
                :title="'商品标题:' + item.goodname" 
                thumb="https://img.yzcdn.cn/vant/t-thirt.jpg" 
                origin-price="10.00" 
                @click="jumpDetailsPage(item.id)">
                    <div slot="tags">
                        <van-tag plain type="danger">标签1</van-tag>
                        <van-tag plain type="danger">标签2</van-tag>
                    </div>
                    <div slot="footer">
                        <van-button size="mini">按钮</van-button>
                        <van-button size="mini">按钮</van-button>
                    </div>
                </van-card>
            </router-link>
            <router-link to="/detail">
            </router-link>
        </ul>
    </div>
</template>

<script>
export default {
    name: 'Goods',
    props: {
        dLists: {
            type: Array,
            default: [{}]
        }
    },
    mounted() {
        console.log(this.dLists);
    },
    methods: {
        jumpDetailsPage(id) {
            console.log('hhhhhhhh:' + id);
        }
    },
}
</script>

<style lang="less" scoped>
#goods {
    margin-bottom: 52px;
}
.sp {
    background-color: #fff;
    height: 30px;
    line-height: 30px;
}
</style>